<template>
  <el-dialog
      top="5vh"
      width="1000px"
      title="添加/编辑订单"
      :visible.sync="dialogValue"
      :close-on-click-modal="false"
      append-to-body
  >
    <SubmitForm
        :rule-form="ruleForm"
        :rules="rules"
        :form-list="formList"
        @change="handleFormChange"
        @save="onSave"
        @close="dialogValue = false"
    />

  </el-dialog>
</template>

<script>
import {http} from '@/api'

export default {
  name: 'OrderAdd',
  data() {
    return {
      apiKey: 'order',
      dialogValue: false,
      ruleForm: {},
      defaultForm: {
        order_no: '',
        user_id: 0,
        address_id: 0,
        address_detail: '',
        address_nickname: '',
        address_phone: '',
        remark: '',
        status: 'pending_pricing',
        order_delivery: 'express',
        express_no: '',
        express_company: '',
        time_expire: null,
        count: 1,
        amount: 0.00,
        payment_time: null,
        payment_type: '',
        payment_amount: 0.00,
        transaction_id: '',
        prepay_id: '',
        refund_no: '',
        refund_transaction_id: '',
        refund_status: -1,
        refund_time: null,
        refund_success_time: null,
        refund_reason: '',
        refund_remark: '',
        refund_amount: 0.00,
        cancel_time: null
      },
      rules: {
        order_no: [{required: true, message: '订单号不能为空'}],
        user_id: [{required: true, message: '用户ID不能为空'}],
        status: [{required: true, message: '订单状态不能为空'}],
      },
      formList: [
        {
          label: '订单号',
          prop: 'order_no',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入订单号'
        },
        {
          label: '用户ID',
          prop: 'user_id',
          name: 'number',
          colSpan: 12,
          min: 1,
          placeholder: '请输入用户ID'
        },
        {
          label: '收货人姓名',
          prop: 'address_nickname',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入收货人姓名'
        },
        {
          label: '联系电话',
          prop: 'address_phone',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入联系电话'
        },
        {
          label: '收货地址',
          prop: 'address_detail',
          name: 'input',
          colSpan: 24,
          rows: 2,
          placeholder: '请输入收货地址'
        },
        {
          label: '订单备注',
          prop: 'remark',
          name: 'input',
          colSpan: 24,
          rows: 2,
          placeholder: '请输入订单备注'
        },
        {
          label: '订单状态',
          prop: 'status',
          name: 'select',
          colSpan: 12,
          placeholder: '请选择订单状态',
          options: [
            { value: 'pending_pricing', label: '待定价' },
            { value: 'pending', label: '待支付' },
            { value: 'paid', label: '已支付' },
            { value: 'refunding', label: '退款中' },
            { value: 'shipped', label: '已发货' },
            { value: 'refunded', label: '已退款' },
            { value: 'completed', label: '已完成' },
            { value: 'cancelled', label: '已取消' },
            { value: 'pending_receipt', label: '待收货' }
          ]
        },
        {
          label: '配送方式',
          prop: 'order_delivery',
          name: 'select',
          colSpan: 12,
          placeholder: '请选择配送方式',
          options: [
            { value: 'express', label: '快递' },
            { value: 'self_pickup', label: '自提' },
            { value: 'no_delivery', label: '虚拟商品' }
          ]
        },
        {
          label: '快递公司',
          prop: 'express_company',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入快递公司'
        },
        {
          label: '快递单号',
          prop: 'express_no',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入快递单号'
        },
        {
          label: '商品数量',
          prop: 'count',
          name: 'number',
          colSpan: 8,
          min: 1
        },
        {
          label: '订单金额',
          prop: 'amount',
          name: 'number',
          colSpan: 8,
          min: 0,
          precision: 2,
          step: 0.01
        },
        {
          label: '支付金额',
          prop: 'payment_amount',
          name: 'number',
          colSpan: 8,
          min: 0,
          precision: 2,
          step: 0.01
        },
        {
          label: '支付方式',
          prop: 'payment_type',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入支付方式'
        },
        {
          label: '支付时间',
          prop: 'payment_time',
          name: 'datetime',
          colSpan: 12,
          dateType: 'datetime',
          valueFormat: 'YYYY-MM-DD HH:mm:ss'
        },
        {
          label: '订单过期时间',
          prop: 'time_expire',
          name: 'datetime',
          colSpan: 12,
          dateType: 'datetime',
          valueFormat: 'YYYY-MM-DD HH:mm:ss'
        },
        {
          label: '取消时间',
          prop: 'cancel_time',
          name: 'datetime',
          colSpan: 12,
          dateType: 'datetime',
          valueFormat: 'YYYY-MM-DD HH:mm:ss'
        },
        {
          label: '退款状态',
          prop: 'refund_status',
          name: 'select',
          colSpan: 12,
          placeholder: '请选择退款状态',
          options: [
            { value: -1, label: '未退款' },
            { value: 0, label: '退款中' },
            { value: 1, label: '退款成功' },
            { value: 2, label: '退款失败' }
          ]
        },
        {
          label: '退款金额',
          prop: 'refund_amount',
          name: 'number',
          colSpan: 12,
          min: 0,
          precision: 2,
          step: 0.01
        },
        {
          label: '退款原因',
          prop: 'refund_reason',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入退款原因'
        },
        {
          label: '退款备注',
          prop: 'refund_remark',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入退款备注'
        },
        {
          label: '申请退款时间',
          prop: 'refund_time',
          name: 'datetime',
          colSpan: 12,
          dateType: 'datetime',
          valueFormat: 'YYYY-MM-DD HH:mm:ss'
        },
        {
          label: '退款成功时间',
          prop: 'refund_success_time',
          name: 'datetime',
          colSpan: 12,
          dateType: 'datetime',
          valueFormat: 'YYYY-MM-DD HH:mm:ss'
        },
        {
          label: '微信支付交易号',
          prop: 'transaction_id',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入微信支付交易号'
        },
        {
          label: '微信预支付ID',
          prop: 'prepay_id',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入微信预支付ID'
        },
        {
          label: '退款单号',
          prop: 'refund_no',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入退款单号'
        },
        {
          label: '退款交易号',
          prop: 'refund_transaction_id',
          name: 'input',
          colSpan: 12,
          placeholder: '请输入退款交易号'
        },
      ]
    }
  },
  methods: {
    handleFormChange({key, val}) {
      // 处理表单变化
    },
    open(row) {
      this.dialogValue = true
      if (row) {
        http[this.apiKey].read(row.id).then(res => {
          this.ruleForm = {
            ...res.data
          }
        })
      } else {
        this.ruleForm = {
          ...this.defaultForm,
          order_no: this.generateOrderNo()
        }
      }
    },
    generateOrderNo() {
      // 生成订单号：年月日时分秒+4位随机数
      const now = new Date();
      const year = now.getFullYear();
      const month = String(now.getMonth() + 1).padStart(2, '0');
      const day = String(now.getDate()).padStart(2, '0');
      const hour = String(now.getHours()).padStart(2, '0');
      const minute = String(now.getMinutes()).padStart(2, '0');
      const second = String(now.getSeconds()).padStart(2, '0');
      const random = Math.floor(Math.random() * 10000).toString().padStart(4, '0');
      return `${year}${month}${day}${hour}${minute}${second}${random}`;
    },
    onSave() {
      http[this.apiKey][this.ruleForm.id ? 'update' : 'create'](this.ruleForm.id, this.ruleForm).then(res => {
        this.$message.success('操作成功')
        this.dialogValue = false
        this.$emit('get-page')
      })
    }
  }
}
</script>

<style scoped lang="scss">
</style> 